<template>
  <div class="infoBox">
    <div class="inputDiv">
      <h5>用户名</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>电话</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>真实姓名</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>昵称</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>Email</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>地址</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>学历</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>毕业院校</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>身份证号</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>银行账号</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>性别</h5>
      <el-select v-model="addData" clearable placeholder="男">
        <el-option label="男" value="beijing"> </el-option>
        <el-option label="女" value="beijing"> </el-option>
      </el-select>
    </div>
    <div class="inputDiv">
      <h5>皮肤</h5>
      <el-select v-model="addData" clearable placeholder="经典蓝">
        <el-option label="经典蓝" value="beijing"> </el-option>
        <el-option label="青草绿" value="beijing"> </el-option>
        <el-option label="中国红" value="beijing"> </el-option>
        <el-option label="商务黄" value="beijing"> </el-option>
        <el-option label="高贵紫" value="beijing"> </el-option>
        <el-option label="商务黄" value="beijing"> </el-option>
      </el-select>
    </div>
    <div class="inputDiv">
      <h5>生日</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>签名</h5>
      <el-input value=""></el-input>
    </div>
    <hr />
    <div class="inputDiv">
      <h5>新的密码</h5>
      <el-input value=""></el-input>
    </div>
    <div class="inputDiv">
      <h5>确认密码</h5>
      <el-input value=""></el-input>
    </div>
    <div class="feature">
      <div>
        <hr />
        <h5 style="margin-bottom: 10px">头像</h5>
        <el-button class="iconfont icon-shangchuan" style="margin-bottom: 10px"
          >上传头像</el-button
        >
        <div>尺寸在512*512以内,大小在500KB以内</div>
      </div>
      <hr />
      <div class="save">
        <span>保存</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "touxiang",
  data() {
    return {
      addData: [],
    };
  },
};
</script>

<style scoped lang="less">
.infoBox {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;
  hr {
    width: 100%;
    border: 1px solid #eeeeee;
    margin: 2% 0px;
  }
  .inputDiv {
    width: 47%;
    margin-top: 1%;
    margin-bottom: 2%;
    .el-select {
      width: 100%;
    }
    h5 {
      padding-bottom: 1%;
    }
  }
}
//底部功能键
.feature {
  width: 100%;
  .save {
    text-align: center;
    line-height: 30px;
    width: 50px;
    height: 30px;
    color: #fff;
    background-color: #208adb;
    border-radius: 3px;
  }
}
</style>